<button
  nz-button
  (click)="handleAdd()"
  [nzLoading]="submitting"
  class="add-btn"
>
  {{ $t('_addRow') }}
</button>

<button
  nz-button
  nzType="primary"
  (click)="handleSubmit()"
  [nzLoading]="submitting"
>
  {{ $t('_save') }}
</button>

<div class="mb12">
  <b>修改完请保存并等待构建完成，离开无效</b>
</div>

<nz-table #basicTable [nzData]="tagList">
  <thead>
    <tr>
      <th>{{ $t('_tagName') }}</th>
      <th>{{ $t('_color') }}</th>
      <th>{{ $t('_createAt') }}</th>
      <th>{{ $t('_remark') }}</th>
      <th>{{ $t('_action') }}</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor="let data of tagList; index as idx">
      <td width="150px">
        <input nz-input [(ngModel)]="data.name" maxlength="10" />
      </td>
      <td width="160px">
        <input
          type="color"
          [value]="data.color"
          (change)="onColorChange($event, idx)"
        />
        - {{ data.color }}
      </td>
      <td width="220px">{{ data.createdAt }}</td>
      <td width="200px">
        <div *ngIf="data.isInner">{{ data.desc }}</div>
        <input
          *ngIf="!data.isInner"
          nz-input
          [(ngModel)]="data.desc"
          maxlength="20"
        />
      </td>
      <td>
        <div *ngIf="!data.isInner">
          <a
            nz-popconfirm
            nzPopconfirmPlacement="rightTop"
            nzOkType="danger"
            [nzPopconfirmTitle]="$t('_confirmDel')"
            nzPopconfirmPlacement="bottom"
            (nzOnConfirm)="handleDelete(idx)"
          >
            <a>{{ $t('_del') }}</a>
          </a>
        </div>
      </td>
    </tr>
  </tbody>
</nz-table>
